<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	request.setAttribute("path", path);//只是为了让el表达式更短一些
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<base href="<%=basePath%>">

<title>作业</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="expires" content="0">
<meta name="keywords" content="keyword1,keyword2,keyword3">
<meta name="description" content="This is my page">
<link rel="icon" href="favicon.ico">

<!-- Bootstrap core CSS -->
<link href="${path}/res/css/bootstrap(2).min.css" rel="stylesheet">
<!-- Bootstrap theme -->
<link href="${path}/res/css/bootstrap-theme.min.css" rel="stylesheet">

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
      <script src="${path}/res/js/html5shiv.min.js"></script>
      <script src="${path}/res/js/respond.min.js"></script>
    <![endif]-->
</head>

<body class="container" ng-app="myapp">
	<jsp:include page="/header.jsp"></jsp:include>
	<!-- =======================header=========================== -->


	<div class="">
		<div id="upload_task_div" class="collapse">
			<form id="new_task_file" class="new_task_file form-horizontal"
				action="task/upload" method="post" role="form"
				enctype="multipart/form-data" accept-charset="UTF-8">
				<div class="col-sm-offset-2">
					<div class="form-group">
						<label class="col-sm-2 control-label" for="teachID">选择所属课程</label>
						<div class="col-sm-8">
							<select class="form-control" ng-controller='TeachController'
								id="teachID" name="task.teach.id">
								<option ng-repeat='teach in teachs' value="{{teach.id}}">
									{{teach.name}}</option>
							</select>
						</div>
					</div>
					<div class="form-group">
						<label for="task_name" class="col-sm-2  control-label">标题</label>
						<div class="col-sm-8">
							<input class="form-control" id="task_name" maxlength="30"
								placeholder="简短易辨识的标题" name="task.title" size="30" type="text"
								required>
						</div>
					</div>

					<div class="form-group">
						<label for="task_deadline" class="col-sm-2  control-label">截止日期</label>
						<div class="col-sm-8">
							<input class="form-control" id="task_deadline"
								placeholder="作业最后提交期限" name="deadline" type="datetime-local"
								value="${suggestTime}" min="${minTime}" required>
						</div>
					</div>

					<div class="form-group">
						<label for="task_content" class="col-sm-2  control-label">作业内容</label>
						<div class="col-sm-8">
							<input class="form-control" id="task_content" maxlength="255"
								name="task.content" size="255" type="text"
								placeholder="在此输入作业内容或选择上传附件">
						</div>
					</div>
					<div class="form-group">
						<label for="courseware_file_upload"
							class="col-sm-2  control-label">点击选择上传附件</label>
						<div class="col-sm-8">
							<input id="courseware_file_upload" name="file" title="点此上传文件"
								type="file" value="点此选择上传文件">
						</div>
					</div>

					<div class="form-group">
						<label for="courseware_file_newFileName"
							class="col-sm-2  control-label">新文件名</label>
						<div class="col-sm-8">
							<input class="form-control" id="courseware_file_newFileName"
								placeholder="输入新的文件名，非必须" maxlength="255" name="newFileName"
								size="255" type="text">
						</div>
					</div>

					<div class="col-sm-offset-2 col-sm-8">
						<div class="progress">
							<div class="progress-bar progress-bar-striped" aria-valuenow="60"
								aria-valuemin="0" aria-valuemax="100" style="width: 0%">
								<span id="percentValue">0%</span>
							</div>
						</div>
					</div>

					<div class="form-group">
						<div class="col-sm-offset-2 col-sm-8">
							<p id="status" class="form-control-static text-success"
								style="margin-bottom: 20px;"></p>
						</div>
					</div>

					<div class="form-group" style='margin-top:30px;'>
						<input
							class="col-sm-offset-4 col-xs-offset-4 btn btn-success btn-lg"
							id="submit_btn" name="commit" type="submit" value="布置作业">
						<input id="reset_btn" class="btn btn-warning" type="reset"
							value="重置">
					</div>
				</div>
			</form>
		</div>

		<div id="new_file" class="">
			<button id="new_file_btn" type="button"
				class="btn btn-primary collapsed" data-target="#upload_task_div"
				data-toggle="collapse">
				<span class="glyphicon glyphicon-plus"></span>&nbsp;布置作业
			</button>
		</div>

		<div class="">
			<div class="row clearfix">
				<div class="col-md-12 column">
					<ul class="nav nav-tabs" role="tablist">
						<li role="presentation" class="active"><a
							href="#unexpired_task" role="tab" data-toggle="tab">未过期</a></li>
						<li role="presentation"><a href="#expired_task" role="tab"
							data-toggle="tab">已过期</a></li>
					</ul>
					<div id="task_div" class="tab-content" ng-controller='TaskController'>
						<div class="tab-pane active" id="unexpired_task" role="tabpanel">
							<!-- 这是未过期的作业 -->
							<div class="panel-group" role="tablist">
								<div class="panel panel-default">
									<div class="panel-heading panel-title"
										id="collapseListGroupHeading1">
										<div class="row">
											<div class="col-sm-1 col-xs-1 text-center">#</div>
											<div class="col-sm-2 col-xs-2 text-center">作业名称</div>
											<div class="col-sm-2 col-xs-2 text-center">课程</div>
											<div class="col-sm-2 col-xs-2 text-center">截止时间</div>
											<div class="col-sm-2 col-xs-2 text-center">布置时间</div>
											<div class="col-sm-2 col-xs-2 text-center">附件</div>
											<div class="col-sm-1 col-xs-1 text-center">操作</div>
										</div>
									</div>

									<div class="panel-collapse" id="task_panel" role="tabpanel"
										aria-labelledby="collapseListGroupHeading1"
										aria-expanded="true">
										<ul class="list-group">
											<li class="list-group-item"
												ng-repeat="row in unexpired_tasks"
												ng-mouseover="mousein($index)">
												<div class="row" data-toggle="tooltip" data-placement="left"
													title="{{row.type}}">
													<div class="col-sm-1 col-xs-1 text-center" ng-bind="$index"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.title" data-toggle="collapse"
														data-target="#demo{{$index}}" style="cursor: pointer;"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.course"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.deadline"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.time"></div>
													<!-- 没有附件的情况 -->
													<div class="col-sm-2 col-xs-2 text-center"
														ng-if="row.attachID == -1" ng-bind="row.attach"></div>
													<!-- 有附件的情况 -->
													<div class="col-sm-2 col-xs-2 text-center"
														ng-if="row.attachID != -1">
														<a href="javascript:void(0)" ng-click="download($index,1)"
															data-toggle="tooltip" data-placement="left" title="下载">
															<span class="glyphicon glyphicon-link">&nbsp;{{row.attach}}</span>
														</a>
													</div>
													<div class="col-sm-1 col-xs-1 text-center"
														ng-show='$index == selectedRow'>

														<a href="task/detail?id={{row.id}}&isExpired=0" data-toggle="tooltip" data-placement="left" title="批改作业">
															<span class="glyphicon glyphicon-pencil"></span>
														</a>&nbsp; <a href="javascript:void(0);" ng-click="remove($index，1)"
															data-toggle="tooltip" data-placement="left" title="删除">
															<span class="glyphicon glyphicon-remove-circle"></span>
														</a>
													</div>
												</div>
												<div id="demo{{$index}}" class="collapse">
													<p>
														题目：<br /> <span class="col-sm-offset-1"
															ng-bind="row.content"></span>
													</p>
												</div>
											</li>
										</ul>

									</div>
								</div>
							</div>
						</div>

						<div class="tab-pane" id="expired_task">
							<!-- 这是已过期的作业 -->
							<div class="panel-group" role="tablist">
								<div class="panel panel-default">
									<div class="panel-heading panel-title"
										id="collapseListGroupHeading1">
										<div class="row">
											<div class="col-sm-1 col-xs-1 text-center">#</div>
											<div class="col-sm-2 col-xs-2 text-center">作业名称</div>
											<div class="col-sm-2 col-xs-2 text-center">课程</div>
											<div class="col-sm-2 col-xs-2 text-center">截止时间</div>
											<div class="col-sm-2 col-xs-2 text-center">布置时间</div>
											<div class="col-sm-2 col-xs-2 text-center">附件</div>
											<div class="col-sm-1 col-xs-1 text-center">操作</div>
										</div>
									</div>

									<div class="panel-collapse" id="task_panel" role="tabpanel"
										aria-labelledby="collapseListGroupHeading1"
										aria-expanded="true">
										<ul class="list-group">
											<li class="list-group-item" ng-repeat="row in expired_tasks"
												ng-mouseover="mousein($index)">
												<div class="row" data-toggle="tooltip" data-placement="left"
													title="{{row.type}}">
													<div class="col-sm-1 col-xs-1 text-center" ng-bind="$index"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.title" data-toggle="collapse"
														data-target="#demo{{$index}}" style="cursor: pointer;"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.course"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.deadline"></div>
													<div class="col-sm-2 col-xs-2 text-center"
														ng-bind="row.time"></div>
													<!-- 没有附件的情况 -->
													<div class="col-sm-2 col-xs-2 text-center"
														ng-if="row.attachID == -1" ng-bind="row.attach"></div>
													<!-- 有附件的情况 -->
													<div class="col-sm-2 col-xs-2 text-center"
														ng-if="row.attachID != -1">
														<a href="download?fileID={{row.attachID}}" data-toggle="tooltip" data-placement="left" title="下载">
															<span class="glyphicon glyphicon-link">&nbsp;{{row.attach}}</span>
														</a>
													</div>
													<div class="col-sm-1 col-xs-1 text-center"
														ng-show='$index == selectedRow'>

														<a href="task/detail?id={{row.id}}&isExpired=1"
															data-toggle="tooltip" data-placement="left"
															title="查看上次提交的作业"> <span
															class="glyphicon glyphicon-eye-open"></span>
														</a> &nbsp;<a href="javascript:void(0);" ng-click="remove($index)"
															data-toggle="tooltip" data-placement="left" title="删除">
															<span class="glyphicon glyphicon-remove-circle"></span>
														</a>
													</div>
												</div>
												<div id="demo{{$index}}" class="collapse">
													<p>
														题目：<br /> <span class="col-sm-offset-1"
															ng-bind="row.content"></span>
													</p>
												</div>
											</li>
										</ul>

									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>

		</div>

<!-- 
		<div class="row" style="margin-top: 20px;">
			<div class="panel-group" role="tablist">
				<div class="panel panel-default">
					<div class="panel-heading panel-title"
						id="collapseListGroupHeading1">
						<div class="row">
							<div class="col-sm-1 col-xs-1 text-center">#</div>
							<div class="col-sm-2 col-xs-2 text-center">作业名称</div>
							<div class="col-sm-2 col-xs-2 text-center">课程</div>
							<div class="col-sm-2 col-xs-2 text-center">截止时间</div>
							<div class="col-sm-2 col-xs-2 text-center">布置时间</div>
							<div class="col-sm-2 col-xs-2 text-center">附件</div>
							<div class="col-sm-1 col-xs-1 text-center">操作</div>
						</div>
					</div>
					<div class="panel-collapse" id="task_panel"
						ng-controller='TaskController' role="tabpanel"
						aria-labelledby="collapseListGroupHeading1" aria-expanded="true">
						<ul class="list-group">
							<li class="list-group-item" ng-repeat="row in tasks"
								ng-mouseover="mousein($index)">
								<div class="row" ng-class="{'bg-warning': row.isExpired == 1}"
									data-toggle="tooltip" data-placement="left"
									title="{{row.type}}">
									<div class="col-sm-1 col-xs-1 text-center" ng-bind="$index"></div>
									<div class="col-sm-2 col-xs-2 text-center" ng-bind="row.title"
										data-toggle="collapse" data-target="#demo{{$index}}"
										style="cursor: pointer;"></div>
									<div class="col-sm-2 col-xs-2 text-center" ng-bind="row.course"></div>
									<div class="col-sm-2 col-xs-2 text-center"
										ng-bind="row.deadline"></div>
									<div class="col-sm-2 col-xs-2 text-center" ng-bind="row.time"></div>
									没有附件的情况
									<div class="col-sm-2 col-xs-2 text-center"
										ng-if="row.attachID == -1" ng-bind="row.attach"></div>
									有附件的情况
									<div class="col-sm-2 col-xs-2 text-center"
										ng-if="row.attachID != -1">
										<a href="download?fileID={{row.attachID}}" ng-bind="row.attach" data-toggle="tooltip"
											data-placement="left" title="下载"></a>
									</div>
									<div class="col-sm-1 col-xs-1 text-center"
										ng-show='$index == selectedRow'>

										<a href="javascript:void(0);" ng-click="remove($index)"
											data-toggle="tooltip" data-placement="left" title="删除"> <span
											class="glyphicon glyphicon-remove-circle"></span>
										</a>

									</div>
								</div>
								<div id="demo{{$index}}" class="collapse">
									<p>
										题目：<br /> <span class="col-sm-offset-1" ng-bind="row.content"></span>
									</p>
								</div>
							</li>
						</ul>

					</div>
				</div>
			</div>
		</div> -->

	</div>




	<!-- ========================footer========================== -->
	<jsp:include page="/footer.jsp"></jsp:include>
	<!-- Bootstrap core JavaScript
    ================================================== -->
	<!-- Placed at the end of the document so the pages load faster -->
	<script src="${path}/res/js/jquery.min.js"></script>
	<script src="${path}/res/js/bootstrap.min.js"></script>
	<script src="${path}/res/js/jquery.fileupload.js"></script>
	<script src="${path}/res/js/jquery.iframe-transport.js"></script>
	<script src="${path}/res/js/jquery.ui.widget.js"></script>
	<script src="${path}/res/js/jquery.form.js"></script>
	<script src="${path}/res/js/angular.min.js"></script>
	<script src="${path}/res/js/teacher_task.js"></script>
	<script type="text/javascript">
		var tasks = '${taskJson}';
		var teachs = '${teachJson}';
	</script>
</body>
</html>
